<ul id="nav">
  <li>
    <a class="left_radius" href="<?php echo url_for('homepage') ?>">Home</a>
    <ul style="display: none">
      <li>
        <a href="<?php echo url_for('essay/index') ?>">Essays</a>
      </li>
      <li>
        <a href="<?php echo url_for('homepage') ?>">Authors</a>
      </li>
    </ul>
  </li>

  <li>
    <a href="<?php echo url_for('author/index') ?>">
      Authors
    </a>
    <ul class="sub">
      <li>
        <a class="last" href="<?php echo url_for('author_categories_index') ?>">
          Categories
        </a>
      </li>
    </ul>
  </li>
  <li>
    <a href="<?php echo url_for('@about') ?>">
      About us
    </a>
  </li>

  <li>
    <a href="<?php echo url_for('@contribute') ?>">
      Contribute
    </a>
  </li>

  <li>
    <a href="<?php echo url_for('contact') ?>">Contact</a>
  </li>

  <?php if($sf_user->isAuthenticated()): ?>
    <li style="float: right">
      <a class="right_radius" href="<?php echo url_for('signout') ?>" >Sign out</a>
    </li>
    <li style="float: right">
      <a href="<?php echo url_for('profile/index') ?>" id="my_profile">My profile</a>
      <ul class="sub">
        <li>
          <a href="<?php echo url_for('profile_bookmarks') ?>">
            My bookmarks
          </a>
        </li>
        <li>
          <a class="last" href="<?php echo url_for('profile_author_bookmarks') ?>">
            Authors bookmarked
          </a>
        </li>
      </ul>
    </li>
    <li style="float: right">
      <span style="float: right">Hello <?php echo $sf_user->getUsername() ?></span>
    </li>
  <?php else: ?>
    <li style="float: right">
      <a class="right_radius" href="<?php echo url_for('signin') ?>">Sign in</a>
    </li>
    <li style="float: right">
      <a href="<?php echo url_for('register') ?>">Register</a>
    </li>
  <?php endif ?>
</ul>

<script type="text/javascript">
  $(document).ready(function(){
    sfHover = function() {
    var sfEls = document.getElementById("nav").getElementsByTagName("LI");
    for (var i=0; i<sfEls.length; i++) {
      sfEls[i].onmouseover=function() {
        this.className+=" sfhover";
      }
      sfEls[i].onmouseout=function() {
        this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
      }
    }
  }
  if (window.attachEvent) window.attachEvent("onload", sfHover);
  })
</script>
